<template>
  <div class="game-layout">
    <router-view />
  </div>
</template>

<script setup lang="ts">
import _ from 'lodash'
import { onMounted } from 'vue'
import { useRouter } from 'vue-router'
import { DispatchResult, isInitNumber } from '../../../tools'
import { RouteQuery } from '../../../tools/routeUtil'
import Api from '../../../components/tools/api'
import Message from '../../../components/message/index'
defineOptions({
  name: 'game-panel'
})

// const store = ref(new SceneStore())
const router = useRouter()
const idValue = _.toNumber(RouteQuery(router, 'id')) //文件id

const dispatchScene = async () => {
  if (!isInitNumber(idValue)) {
    await createGame()
  }
}

const createGame = async () => {
  try {
    const uid = 1
    const result = await Api.send(`/game/createData`, {
      uid: uid
    })
    DispatchResult(result, {
      onSuccess: (data: any) => {
        const { id } = data
        if (isInitNumber(id)) {
          router.replace(`/game/${id}/base-scene`)
        } else {
          Message({ message: '游戏创建失败', type: 'error' })
        }
      },
      onError: (_data: any, message: string) => {
        Message({ message, type: 'error' })
      }
    })
  } catch (error) {
    console.log(error)
  }
}
// uid

onMounted(() => {
  dispatchScene()
})
</script>

<style lang="scss">
.game-layout {
  text-align: center;
  height: 100%;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
</style>
